<template>
  <div class="container">
    <div class="calcMain">
      <div class="topBtn">
        <div >
          <span class="pageTitle1" style="font-weight: bolder">执行 / </span>
          <span class="xinjian" style="font-weight: bold">新建任务</span>
        </div>
      </div>
      <div class="bottomMain">
        <el-form
          ref="addFormR"
          :rules="rules"
          class="addForm"
          label-position="right"
          label-width="100px"
          :model="formLabelAlign"
        >
          <el-form-item label="评估模型" prop="commitName">
            <div style="display: flex;">
              <el-button class="flexAlign" size="size" @click="importByCao" style="font-size: 13px;width: 120px;height: 32px">
                <img :src="require('@/assets/images/cao11.png')" alt="" srcset="" />
                模型导入
              </el-button>
              <div  class="daoruName" v-model="formLabelAlign.commitName">{{formLabelAlign.commitName || ''}}</div>
            </div>
          </el-form-item>
          <el-form-item label="任务编号" prop="code">
            <el-input v-model="formLabelAlign.code"></el-input>
          </el-form-item>
          <el-form-item label="任务名称" prop="rwname">
            <el-input v-model="formLabelAlign.rwname"></el-input>
          </el-form-item>
          <el-form-item label="任务说明" >
            <el-input v-model="formLabelAlign.statement"></el-input>
          </el-form-item>
          <el-form-item label="任务描述">
            <el-input type="textarea" v-model="formLabelAlign.content"></el-input>
          </el-form-item>
          <el-form-item>
            <el-button type="primary" @click="submitForm">保存并去评估计算</el-button>
            <el-button @click="setPanel">取消</el-button>
          </el-form-item>
        </el-form>
      </div>
    </div>
    <el-dialog title="选择评估模型" :visible.sync="importDialog" width="60%">
      <el-form
        :inline="true"
        size="mini"
        :model="formInline"
        class="demo-form-inline"
        style="display: flex; justify-content: space-between"
      >
        <el-form-item label="创建时间">
          <el-date-picker
            v-model="formInline.createTime"
            type="daterange"
            start-placeholder="开始日期"
            end-placeholder="结束日期"
            value-format="yyyy-MM-dd"
          >
          </el-date-picker>
        </el-form-item>
        <el-form-item label="类型">
          <el-select v-model="formInline.type" placeholder="类型" clearable>
            <el-option label="模糊" value="模糊"></el-option>
            <el-option label="AHP" value="AHP"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="模型名称">
          <el-input
            v-model="formInline.modelName"
            placeholder="模型名称"
            clearable
          ></el-input>
        </el-form-item>
        <el-form-item>
          <el-button type="primary" @click="onSubmit">
            <img :src="require('@/assets/images/cha3.png')" alt="" srcset="" />
            查询
          </el-button>
        </el-form-item>
      </el-form>
      <el-table
        :data="modelList"
        border
        stripe
        size="mini"
        @row-click="rowClick"
        show-overflow-tooltip
        highlight-current-row
        :header-cell-style="{ textAlign: 'center',  }"
        :cell-style="{'text-align':'center'}"
      >
        <el-table-column label="选择" width="55" align="center">
          <template slot-scope="scope">
            <el-radio :label="scope.row.id" v-model="currModelId">
              {{ "" }}
            </el-radio>
          </template>
        </el-table-column>
        <el-table-column type="index" align="center" label="序号" width="60">
        </el-table-column>
        <el-table-column prop="name" label="评估模型名称"> </el-table-column>
        <el-table-column prop="type" align="center" label="评估模型类型"> </el-table-column>
        <el-table-column prop="createTime" align="center" label="创建时间" width="150">
        </el-table-column>
        <el-table-column prop="createBy" label="创建人员"> </el-table-column>
        <el-table-column prop="polymerizationAlg" label="算法类型"> </el-table-column>
      </el-table>

      <el-pagination
        background
        layout="total, prev, pager, next"
        :total="modelTotle"
        :current-page="modelCurrPage"
        @current-change="changeModelPage"
        style="text-align: right"
      >
      </el-pagination>
      <span slot="footer" class="dialog-footer">
        <el-button size="mini" @click="importDialog = false">取 消</el-button>
        <el-button
          size="mini"
          :disabled="!currModelId"
          type="primary"
          @click="commitImport($event)"
        >
          确 定
        </el-button>
      </span>
    </el-dialog>
  </div>
</template>
<script>
import { getModelList, importModel, getDictList } from "@/api/calc";
import { eisIndicatorSystem, getModelByStatus, selectModelTreeById, queryById, queryModelById, indicatorSet } from '@/api/accessModel.js'

export default {
  name: "addForm",
  data() {
    return {
      rules: {
        commitName: [
          { required: true, message: '请选择评估模型', trigger: 'blur' },
        ],
        code: [
          { required: true, message: '请输入任务编号', trigger: 'blur' },
        ],
        rwname:[
          { required: true, message: '请输入任务名称', trigger: 'blur' },
         ],
      },
      formLabelAlign: {
        statement:'',
        commitName:'',
        content:'',
        name: "",
        rwname: "",
        rwsw: "",
        desc: "",
        qtdesc:'',
      },
      modelType: 1,
      modelList: [],
      modelCurrPage: 1,
      modelTotle: 0,
      formInline: {
        value1: "",
        region: "",
        user: "",
        createTime:[],
      },
      importDialog: false,
      cities: [],
      chuliMethods: [],
      value: "",
      pCurrPage: 1,
      pTotal: 0,
      currModelId: 0, // 当前选中的模型id
      currModel: {}, // 当前选中的模型
      commitModel: {},
    };
  },
  computed: {
    isSelectedModel: function () {
      return JSON.stringify(this.commitModel) !== "{}";
    },
  },
  created() {
    this.getDict("sys_data_source", "cities");
    // this.getDict("sys_data_methods", "chuliMethods");
    this.getAlgList();
  },
  mounted() {},
  methods: {
    setPanel() {
      this.$emit("changePanel", {name:"task"});
    },
    submitForm() {
      //this.currModel 模型导入的数据。加上this.formLabelAlign作为入参去保存
      this.$refs["addFormR"].validate(valid => {
        if (valid) {
          this.$emit("changePanel", {name:"calc",emid:this.currModelId,formLabelAlign:this.formLabelAlign,add:true});
        }
      });
    },
    addTask() {
      this.panel = "add";
    },
    getAlgList() {
      this.chuliMethods = [
        {
          key: "YCL_ZZSSF",
          label: "正整数算法",
        },
        {
          key: "YCL_JSPJZSF",
          label: "计算平均值算法_wait",
        },
        {
          key: "YCL_ZSSSF",
          label: "正实数算法",
        },
        {
          key: "YCL_PDSiDJSF",
          label: "判断四等级算法",
        },
        {
          key: "YCL_PDSDJSF",
          label: "判断三等级算法",
        },
        {
          key: "YCL_PDSFSF",
          label: "判断是否算法",
        },
        {
          key: "YCL_FFSSSF",
          label: "非负实数算法",
        },
        {
          key: "YCL_FFZSSF",
          label: "非负整数算法",
        },
      ];
      // getAlgsList().then((res) => {
      //   if (res.code == 200) {
      //     this.chuliMethods = res.data;
      //   }
      // });
    },

    getDict(dictType, key) {
      getDictList({
        pageNum: 1,
        pageSize: 20,
        dictType,
      }).then((res) => {
        if (res.code == 200) {
          this[key] = res.rows;
        }
      });
    },
    searchP() {
      this.pCurrPage = 1;
      this.getPretreatment();
    },
    changePPage() {
      this.getPretreatment();
    },
    changeModelPage(val) {
      this.modelCurrPage= val
      this.getModel();
    },
    commitImport(val) {
      this.formLabelAlign.commitName = this.currModel.name
      this.commitModel = this.currModel;
      importModel({ status: this.modelType, id: this.commitModel.id }).then((res) => {
        this.importDialog = false;
        this.$modal.msgSuccess("导入成功");
      });
      this.pCurrPage = 1;
      this.getPretreatment();
    },
    view() {},
    rowClick(val) {
      this.currModelId = val.id;
      this.currModel = val;
    },
    onSubmit() {
      this.modelCurrPage = 1;
      this.getModel();
    },
    importByPing() {
      this.modelType = 1;
      this.modelCurrPage = 1;
      this.getModel();
    },
    importByCao() {
      this.modelType = 2;
      this.currModelId=''
      this.modelCurrPage = 1;
      this.getModel();
    },
    getModel() {
      const params = {
        status: this.modelType,
        startTime: this.formInline.createTime[0],
        endTime: this.formInline.createTime[1],
        // createTime: this.formInline.createTime,
        type: this.formInline.type,
        name: this.formInline.modelName,
        // status: this.modelType,
        pageNo: this.modelCurrPage,
        pageSize: 10,
      };
      this.importDialog = true;
      getModelByStatus(params).then((res) => {
        if (res.code == 200) {
          this.modelList = res.data.records;
          this.modelTotle = res.data.total;
        }
      });
    },
  },
};
</script>
<style lang="scss" scoped>
.container {
  width: 100%;
  height: 100%;
  box-sizing: border-box;
  padding: 10px;
  .daoruName{
    padding-left:15px;width: 250px;height: 32px;background: #F0F4FC;border-radius: 5px;margin-left: 30px;font-size: 14px;
    font-family: Alibaba PuHuiTi;
    font-weight: 600;
    color: #3670F5;
    line-height: 32px;
  }
  ::v-deep .el-date-editor--daterange.el-input__inner {
    width: 250px;
  }
  ::v-deep .el-button span {
    display: flex;
    align-items: center;
    img {
      display: block;
      margin-right: 5px;
    }
  }
  .flexAlign {
    display: flex;
    align-items: center;
    img {
      display: block;
      margin-right: 5px;
    }
    span {
      display: flex;
      align-items: center;
    }
  }

  .calcMain {
    background-color: #fff;
    box-shadow: 0 0 10px 10px #ccc;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.8), #ffffff);
    box-shadow: 0px 4px 10px 0px rgba(0, 34, 64, 0.05);
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.12), 0 0 3px 0 rgba(0, 0, 0, 0.04);
    border-radius: 5px;
    height: 100%;
    width: 100%;
    .topBtn {
      height: 50px;
      padding: 10px;
      box-sizing: border-box;
      display: flex;
      align-items: center;
      justify-content: space-between;
      border-bottom: 1px solid #e4e8f1;
      .line {
        width: 1px;
        height: 30px;
        margin: 0 20px;
        background: #e4e8f1;
        border-radius: 1px;
      }
      .pageTitle {
        font-size: 18px;
        font-family: Alibaba PuHuiTi;
        font-weight: 500;
        color: #3771f5;
        line-height: 30px;
      }

      .pageTitle1 {
        font-size: 18px;
        font-family: Alibaba PuHuiTi;
        font-weight: 500;
        color: #333;
        line-height: 30px;
      }
      .qing {
        font-size: 14px;
        font-family: Alibaba PuHuiTi;
        font-weight: 400;
        color: #878c98;
        line-height: 30px;
      }
      .xinjian {
        font-size: 18px;
        font-family: Alibaba PuHuiTi;
        font-weight: 500;
        color: #3771f5;
        line-height: 30px;
      }
    }
    .bottomMain {
      padding: 10px;
      box-sizing: border-box;
      .title1,
      .title2 {
        font-size: 18px;
        font-family: Alibaba PuHuiTi;
        font-weight: 400;
        color: #393b3c;
        line-height: 38px;
      }
      .addForm {
        width: 500px;
        margin: 50px auto;
      }
    }
  }
}
</style>
